<%--
  Created by IntelliJ IDEA.
  User: 22936
  Date: 2022/4/29
  Time: 10:39
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>MyShare登录页</title>
    <link rel="shortcut icon" type="image/x-icon" href="static/img/book.ico"></link>
    <style type="text/css">
        * {
            margin: 0px;
            padding: 0px;
        }

        body {
            width: auto;
            height: 100%;
            background: url("./static/img/B5.jpg") no-repeat;
            background-size: 100% 800px;

        }

        div {
            border: 3px solid darkgray;
            border-radius: 25px;
            width: 400px;
            height: 500px;
            position: absolute;
            right: 200px;
            top: 100px;
            overflow: hidden;
        }

        img {
            width: 170px;
            height: 170px;
            margin: 5% 0 7% 30%;
            border-radius: 50%;

        }

        form {
            width: 400px;
            height: 500px;
        }

        p {
            color: whitesmoke;
            display: inline-block;
            margin: 0 5%;
        }

        input {
            border: 1px solid whitesmoke;
            border-radius: 15px 15px;
        }

        #name, #pwd {
            margin: 8% 3% 0 0;
            width: 60%;
            height: 8%;
            display: inline-block;
        }

        #name, #pwd:focus {
            border: none;
            outline: none;
        }

        #submit {
            margin-left: 10%;
        }

        #btn_register {
            margin: 0 17%;
        }

        #submit, #btn_register, #btn_forget {
            border: 1px solid deepskyblue;
            background-color: deepskyblue;
            border: none;
            outline: none;
            margin-top: 15%;
            color: white;
            height: 7%;
            width: 15%;
            border-radius: 15px 15px;
        }

        form:hover #submit, #btn_register, #btn_forget {
            cursor: pointer;
        }
    </style>
</head>
<body>
<a href="${pageContext.request.contextPath}/user/allBook">返回书籍列表页</a>
<div>
    <img src="./static/img/MyShare.jpg">
    <form action="${pageContext.request.contextPath}/user/login" method="post">
        <p>用户名：</p><input type="text" name="uName" id="name" placeholder="请输入用户名">
        <br>
        <p>密&nbsp;&nbsp;&nbsp;码：</p><input type="password" name="uPassword" id="pwd" placeholder="请输入密码">
        <br>
        <input type="submit" value="登录" id="submit" onmouseenter="checkInputData()">
        <input type="button" value="注册" id="btn_register" onclick="register()">
        <input type="button" value="忘记密码" onclick="goFindPwd()" id="btn_forget">
    </form>
</div>
<script src="static/js/jquery-3.4.1.min.js"></script>
<script>
    function register() {
        window.open("${pageContext.request.contextPath}/register.jsp", "_self");
    }

    function checkInputData() {
        let userName = $("#name").val();
        let pwd = $("#pwd").val();
        if ((userName === '' || userName === null) || (pwd === '' || pwd === null)) {
            $("#submit").css("disable", false);
            alert("请输入用户名或密码");
        } else {
            $("#submit").css("disable", true);
        }
    }
    function goFindPwd(){
        window.open("${pageContext.request.contextPath}/findPwd.jsp", "_self");
    }
</script>
</body>
</html>
